import 'package:flutter/material.dart';

class ListViewBuilder extends StatefulWidget {
  const ListViewBuilder({ super.key });

  @override
  _ListViewBuilderState createState() => _ListViewBuilderState();
}

class _ListViewBuilderState extends State<ListViewBuilder> {
  List<int> list = [1,2,3,4,5,6,7];

  // 抽提Widget函数 和抽提Buidler是一样的
  Widget getListItem (int index) {
    return   Container(
          margin: const EdgeInsets.all(20),
          height: 100,
          color: const Color.fromARGB(255, 100, 208, 23),
          child:  Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(list[index].toString(),
               style: const TextStyle(
                color: Colors.white,
                fontSize: 40
               ),
              )
            ],
          ),
        ); 
  }

  @override
  Widget build(BuildContext context) {
    
    return Container(
      child: ListView.builder(
        itemBuilder: (BuildContext context, int index) {
        return getListItem(index);
        //   Container(
        //   margin: const EdgeInsets.all(20),
        //   height: 100,
        //   color: const Color.fromARGB(255, 100, 208, 23),
        //   child:  Row(
        //     mainAxisAlignment: MainAxisAlignment.center,
        //     children: [
        //       Text(list[index].toString(),
        //        style: const TextStyle(
        //         color: Colors.white,
        //         fontSize: 40
        //        ),
        //       )
        //     ],
        //   ),
        // ); 
      },
      itemCount: list.length,
      ),
    );
  }
}

// ForEach(this.list, (item, index) => {})